<template>
    <div>
        <h1>小头爸爸</h1>
        {{sex}}
        <Big :money="money" :list="list"></Big>
        <button @click="btn">传值改动</button>
    </div>
</template>

<script>
import Big from './Big.vue';

export default {
    name: '',
    props:{
        sex:{
            type:String
        }
    },
    data() {
        return {
            money:'100w',
            list:[
                {name:'jack',age:18},
                {name:'jerry',age:20},
                {name:'tom',age:19}
            ],
        };
    },
    components: {
        Big,
    },
    methods:{
        btn(){
            this.money = '200w';
            this.list[0].age = 30;
        }
    },
    // 不要修改props中的值，如果要改动，请在父元素中进行更改（初始值的值在哪里就去哪里更改）
    // 当改动了props中的值后，基本数据类型会报错，引用数据类型不会报错，但是这种做法违背组件之间传值的单项数据流的概念 不建议这种方式
}
</script>

<style lang="scss" scoped>

</style>